<template>
  <main class="w-full h-full">
    <big></big>
    <min></min>
  </main>
</template>

<script setup lang="ts">
  import Big from './components/Big.vue';
  import Min from './components/Min.vue';
  let isLoad = ref(false);
  onMounted(() => {
    isLoad.value = true;
  });
</script>

<style scoped>
  :deep(.ant-form-item-control-input-content) {
    @apply flex justify-between;
  }
  :deep(.ant-btn) {
    @apply h-10;
  }
  :deep(.ant-btn) {
    @apply dark:(bg-[#0960bb] border-[#0960bb]);
  }
  :deep(.ant-btn:hover) {
    @apply dark:(bg-[#246ebb] border-[#246ebb]);
  }
  :deep(.ant-input),
  :deep(.ant-input-affix-wrapper) {
    @apply dark:(bg-[#232a3c] border-[#232a3c] text-light-300);
  }
  :deep(.ant-input:hover),
  :deep(.ant-input-affix-wrapper:hover) {
    @apply !border-[#40a9ff];
  }
  :deep(.ant-input-password-icon) {
    @apply text-[#89929c];
  }
  :deep(.ant-checkbox-wrapper) {
    @apply dark:text-[#c7cfd7];
  }
  :deep(.ant-divider-inner-text) {
    @apply text-gray-500 text-xs;
  }

</style>
